<template>
	<view class="beijt" v-if="pageShow">
		<view class="flexcenter">
			<view class="box">
				<view class="flexcenter">
					<image :src="userinfo.avatar_text" mode="" class="img"></image>
					<view  style="text-align: left;">
						<view>{{userinfo.nickname}}</view>
						<view class="txt">手机号：{{userinfo.mobile}}</view>
						<view style="display: flex;" class="txt" @click="copy(userinfo.invite_code)">邀请码：{{userinfo.invite_code}}</view>
					</view>
				</view>
				<view class="margin_top5 flexcenter">
					<uqrcode ref="uqrcode" canvas-id="qrcode" @click="ewmfn" v-bind:value="qrcodeurl"
						:options="{ margin:20}" size="150">
					</uqrcode>
				</view>
			</view>
		</view>
		<view class="mainpadding posibottom">
			<view class="btn" @click="saveimg"></view>
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				userinfo: {},
				// qrcodeurl: uni.getStorageSync("share_url"),
				qrcodeurl:"ads",
				pageShow: true
			}
		},
		onShow() {
			this.getdata()
			this.datalist()
		},

		methods: {
			copy(val){
				uni.setClipboardData({
					data: val, //要被复制的内容
					success: () => {
						//复制成功的回调函数
						httpRequest.toast("复制成功")
					}
				});
			},
			// 二维码点击预览图片
			ewmfn() {
				this.$refs.uqrcode.toTempFilePath({
					success: res => {
						console.log(res);
						var i = [res.tempFilePath]; //获取当前页面的轮播图数据
						//uniapp预览轮播图
						uni.previewImage({
							current: 0, //预览图片的下标
							urls: i //预览图片的地址，必须要数组形式，如果不是数组形式就转换成数组形式就可以
						})
					}
				});
			},
			// // 获取链接
			getdata() {
				let _this = this;
				httpRequest.request('/api/index/getConfigInfo', 'GET', {}).then(res => {
					if (res.code == 1) {
						this.qrcodeurl = res.data.share_url + '?code=' + uni.getStorageSync("invite_code")
						this.pageShow = true
					}
				})
			},
			datalist() {
				let _this = this;
				httpRequest.request('/api/user/index', 'GET', {}).then(res => {
					if (res.code == 1) {
						this.userinfo = res.data
					}
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			saveimg(){
				this.$refs.uqrcode.save({
				  success: () => {
				   httpRequest.toast("保存成功")
				  }
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	// #qrcode{
	// 	width: 100%;
	// 	height: 100%;
	// }
	/deep/.uqrcode-canvas{
		width: 380rpx !important;
		height: 380rpx !important;
		margin-top: -30rpx;
	}
	.txt {
		font-size: 24rpx;
	}

	.img {
		width: 85rpx;
		height: 85rpx;
		border-radius: 50%;
		margin-right: 20rpx;
	}

	.box {
		background-color: #F46C1A;
		padding: 54rpx 80rpx;
		background-color: #ffff;
		position: relative;
		top: 600rpx;
		// left: 10%;
		// right: 10%;
		width: 85%;
		height: 560rpx;
		text-align: center;
		border-radius: 4%;
		box-sizing: border-box;
	}

	.yaoqhybtn {
		width: 100%;
		height: 83rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 30rpx;
		font-weight: 600;
		color: RGBA(239, 16, 0, 1);
		background-color: #fed970;
		border-radius: 40rpx 40rpx;
	}

	.btn {
		width: 535rpx;
		height: 113rpx;
		background-image: url('@/static/image/system/yqbtn.png');
		background-size: 100% 100%;
		position: fixed;
		left: 50%;
		bottom: 80rpx;
		transform: translateX(-50%);
	}

	.shilitu {
		margin: 40rpx auto 0;
		// image {
		// 	width: 100%;
		// 	height: 100%;
		// }
	}

	.beijt {
		width: 100%;
		background-size: 100% 100%;
		/*#ifdef H5*/
		height: calc(100vh - 88rpx);
		/*#endif*/
		/*#ifdef MP-WEIXIN || APP-PLUS*/
		min-height: 100vh;
		/*#endif*/
		background-image: url('@/static/image/system/yqbg.png');
	}
</style>